<%--
  Created by IntelliJ IDEA.
  User: qianlong
  Date: 2018/12/19
  Time: 16:24
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <title>角色信息分页</title>
    <link rel="stylesheet" href="../../layuiadmin/layui/css/layui.css" media="all">
    <script>
        var session="${sessionScope.session}"
        var s=""
        if(session==null || session==s){
            location.href="../../BgLogin.jsp";
        }
    </script>
</head>
<body>
<br>
<div class="demoTable">
    <div class="layui-inline">
        <input placeholder="请输入角色名称" class="layui-input" name="name" id="name" autocomplete="off">

    </div>
    <button class="layui-btn" data-type="reload" ><i class="layui-icon">&#xe615;</i>搜索</button>
    <button type="button"  class="layui-btn"   onclick="add()"><i class="layui-icon">&#xe608;</i>新增</button>
    <button class="layui-btn " data-type="isDele" ><i class="layui-icon">&#xe609;</i>批量删除</button>
</div>


<table class="layui-hide" id="test" lay-filter="test"></table>

<script type="text/html" id="barDemo">

    <a class="layui-btn layui-btn-xs" lay-event="edit"><i class="layui-icon">&#xe642;</i>编辑</a>
    <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del" ><i class="layui-icon">&#xe640;</i>删除</a>

</script>

<script src="../../layuiadmin/layui/layui.js"></script>
<script>
    layui.use('table', function(){
        var table = layui.table;

        table.render({
            elem: '#test'
            ,url:'/RolePageServlet'
            ,title: '角色表'
            ,cols: [[
                {type:'checkbox',fixed: 'left'}
                ,{type:'numbers', title:'序号', fixed: 'left'}
                ,{field:'roName', title:'名称', width:300,  unresize: true, sort: true}
                ,{field:'roDesc', title:'描述', width:500, edit: 'text',sort: true}
                ,{field:'roRool', title:'拥有权限', width:500, edit: 'text',sort: true}
                ,{fixed: 'right', width: 250, align:'center', toolbar: '#barDemo',title:'操作'}
            ]]
            ,page: true
            ,limits:[2,4,8,10,15,20]
            ,id:'testReload'
        });


        //监听工具条
        table.on('tool(test)', function(obj){
            var data = obj.data;
            if(obj.event === 'edit'){
                parent.layer.open({   //打开一个弹出层
                    title: '修改信息',   //弹出层的标题
                    maxmin: true,
                    type: 2,
                    content: '/RoleEchoServlet?ID='+data.roId, //要访问的地址
                    area: ['600px', '500px'], //弹出层的大小
                    end: function () { //表示弹出层关闭的时候的代码块
                        location.reload();
                    }
                });
            } else if(obj.event === 'del'){
                layer.confirm('真的删除行么', function(index){

                    $.ajax({
                        url:"/RoleDeleServlet",   //请求路径
                        datatype:"json",//返回的格式
                        data:{id:data.roId}, //参数
                        type:"get", //什么请求
                        success:function (data) { //请求成功以后
                            //AJAX成功以后返回的
                            var obj = eval('(' + data + ')');
                            layer.msg(obj.msg);

                            //延时500ms关闭窗口
                            setTimeout(function () {
                                location.reload();
                            }, 500);
                        }
                    });
                });
            }
        });
        var $ = layui.$, active = {
            getCheckData: function(){ //获取选中数据
                var checkStatus = table.checkStatus('testReload')
                    ,data = checkStatus.data;
                layer.alert(JSON.stringify(data));
            }
            ,getCheckLength: function(){ //获取选中数目
                var checkStatus = table.checkStatus('testReload')
                    ,data = checkStatus.data;
                layer.msg('选中了：'+ data.length + ' 个');
            }
            ,isAll: function(){ //验证是否全选
                var checkStatus = table.checkStatus('testReload');
                layer.msg(checkStatus.isAll ? '全选': '未全选')
            }
            ,isDele: function(){//批量删除
                layer.confirm('真的删除选中行么', function(index) {
                    var checkStatus = table.checkStatus('testReload')
                        , data = checkStatus.data;
                    var objs = eval(data);
                    if(objs.length!=null&&""!=objs.length) {
                        var str = "";
                        for (var j = 0; j < objs.length; j++) {
                            if (j == 0) {
                                str = str + objs[j].roId;
                            } else {
                                str = str + "," + objs[j].roId;
                            }
                        }

                        $.ajax({
                            url:"/RoleDeleAllServlet",   //请求路径
                            datatype:"json",//返回的格式
                            data:{str:str}, //参数
                            type:"post", //什么请求
                            success:function (data) { //请求成功以后
                                //AJAX成功以后返回的
                                layer.msg(data.msg);

                                //延时500ms关闭窗口
                                setTimeout(function () {
                                    location.reload();
                                }, 500);
                            }
                        });
                    }else{
                        layer.confirm('未选行', function(index) {
                            layer.close(index);
                        });
                    }
                })
            }
            ,reload: function(){
                //获取相关值name
                var name = $('#name');
                //执行重载
                table.reload('testReload', {
                    page: {
                        curr: 1 //重新从第 1 页开始
                    }
                    ,where: {

                        name: name.val(),

                    }
                });
            }
        };
        $('.demoTable .layui-btn').on('click', function(){
            var type = $(this).data('type');
            active[type] ? active[type].call(this) : '';
        });
    });
</script>
<script>

    //添加角色
    function add() {
        parent.layer.open({
            title:'新增角色',
            maxmin:true,
            type:2,
            content:'/RoleAddEchoServlet',
            area:['650px','550px'],
            end:function   () {
                location.reload();
            }
        })
    }
</script>
</body>
</html>

